﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Main.Master" AutoEventWireup="true" CodeBehind="CronologiaMovimenti.aspx.cs" Inherits="FimetContoDeposito.Operazioni.CronologiaMovimenti" %>

<%@ Register assembly="GrayParrot.Web.Controls" namespace="GrayParrot.Web.Controls" tagprefix="cc1" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <asp:PlaceHolder ID="PlaceHolder1" runat="server">        
        <%: Styles.Render("~/bundles/Datatables/css") %>
        <%: Scripts.Render("~/bundles/Datatables") %>
    </asp:PlaceHolder>

<%--    <script type="text/javascript" lang="javascript" src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.4/moment.min.js"></script> 
    <script type="text/javascript" lang="javascript" src="//cdn.datatables.net/plug-ins/1.10.13/sorting/datetime-moment.js"></script> --%>

    <script type="text/javascript" lang="javascript" src="../Scripts/GrayParrot.Core.js"></script> 
    <script type="text/javascript" lang="javascript" src="../Scripts/GrayParrot.DataTables.js"></script> 
    <script type="text/javascript" lang="javascript" src="../Scripts/GrayParrot.Modals.js"></script> 
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <!-- 
        Sitemap Menu item:
        <siteMapNode url="~/CronologiaMovimenti.aspx" title="CronologiaMovimenti" description="CronologiaMovimenti" image="fa-laptop" id="CronologiaMovimenti"/>
    -->
    <section class="panel">
	    <header class="panel-heading">
			<b>Cronologia Movimenti</b>
		</header>

        <a class="collapsed" data-toggle="collapse" href="#collapseSetting">
            <h4 class="fa  fa-search"> Filters</h4>
        </a>
        <section id="collapseSetting" class="collapse" style="height: 0px;">
            <div class="collapse-boby" style="padding:0">
                <% HttpContext.Current.Response.Write(this.JQDTCronologia.RenderExternalFilters()); %>
            </div>
        </section>
        
		<div class="panel-body">

            <!-- PUT YOUR CONTENT HERE -->
            <iframe id='iframeCrud' frameborder="0" style="width:800px; height:450px; display:none"></iframe>
            <div id="crudDialog" title="" style="display:none"></div>

            <div class="row">
			   <div class="col-md-6">
                    <cc1:JQDataTable ID="JQDTCronologia" runat="server" 
                            SelectionMode="Single" 
                            RenderScripts="false" 
                            BootstrapClasses="table table-hover table-bordered table-condensed">
                        <FeaturesConfig>
                            <Features>
                                <cc1:Searching Value="Individual" ExternalFilters="true">
                                    <Filters>
                                        <cc1:TextColumnFilter ColumnName="NumeroDDT" />
                                        <cc1:DateColumnFilter ColumnName="DataDDT" DateFormat="dd/mm/yyyy" IsRange="true" />
                                        <cc1:SelectColumnFilter ColumnName="Cliente" 
                                                                SelectType="Simple" Url="/api/Common/LoadCustomersDDL"
                                                                IdProp="value" TextProp="name" Width="400"
                                                                MinimumInputLength="2" />
                                        <cc1:SelectColumnFilter ColumnName="Fornitore" 
                                                                SelectType="Simple" Url="/api/Common/LoadFornitoriDDL"
                                                                IdProp="value" TextProp="name" Width="400"
                                                                MinimumInputLength="2" />
                                        <cc1:TextColumnFilter ColumnName="TipoMovimento"/>
                                        
                                    </Filters>
                                </cc1:Searching>
                                <cc1:AutoWitdh Value="true" />
                                <cc1:ScrollY Value="500" ScrollCollapse="true" />
                                <cc1:LengthChange Value="false" />
                                <cc1:Paging PagingType="FullNumbers" PageLength="20" />
                            </Features>
                        </FeaturesConfig>
                        <ControllerConfig Url="/api/Movimenti/LoadCronologia" LoadingMode="OnLoad">
                        </ControllerConfig>
                        <ColumnsConfig Key="Id">
                            <Columns>
                                <cc1:TextColumn Name="Id" Header="Id" Visible="false" />
                                <cc1:TextColumn Name="NumeroDDT" Header="NumeroDdt" />
                                <cc1:DateColumn Name="DataDDT" Header="Data" />
                                <cc1:TextColumn Name="IdCliente" Header="Id Cliente" Visible="false" />
                                <cc1:TextColumn Name="Cliente" Header="Cliente" />
                                <cc1:TextColumn Name="Fornitore" Header="Fornitore" />
                                <cc1:TextColumn Name="TipoMovimento" Header="Tipo Movimento" />
                                <cc1:ActionColumn >
                                    <Actions>
                                        <cc1:ActionIcon Icon="fa fa-search" Callback="MostraDettaglio" />
                                        <cc1:ActionIcon Icon="fa fa-trash-o" Callback="CancellaMovimento" />
                                    </Actions>
                                </cc1:ActionColumn>
                            </Columns>
                        </ColumnsConfig>
                        <EventsConfig>
                            <Events>
                                <cc1:CreatedRow FunctionSignature="row, data, index" Callback="TranslateEnum" />
                            </Events>
                        </EventsConfig>
<%--                        <Buttons>
                            <cc1:CustomButton Text="Dettaglio" Callback="MostraDettaglio" />
                            <cc1:CrudDeleteButton Text="Cancella" Callback="CancellaMovimento" />
                        </Buttons>--%>
                    </cc1:JQDataTable>
               </div>
               <div class="col-md-6">
                    <cc1:JQDataTable ID="JQDTCronologiaDettaglio" runat="server" 
                            SelectionMode="Single" 
                            RenderScripts="false" 
                            BootstrapClasses="table table-hover table-bordered table-condensed">
                        <FeaturesConfig>
                            <Features>
                                <cc1:Searching Value="None" />
                                <cc1:AutoWitdh Value="true" />
                                <cc1:ScrollY Value="500" ScrollCollapse="true" />
                                <cc1:LengthChange Value="false" />
                                <cc1:Paging PagingType="FullNumbers" PageLength="20" />
                            </Features>
                        </FeaturesConfig>
                        <ControllerConfig Url="/api/Movimenti/LoadDettaglioCronologia" LoadingMode="Redraw">
                            <ControllerParameters>
                                <cc1:ControllerParameter Name="IdMovimento" Eval="GetIdMovimento" />
                            </ControllerParameters>
                        </ControllerConfig>
                        <ColumnsConfig Key="Id">
                            <Columns>
                                <cc1:TextColumn Name="Id" Header="Id" Visible="false" />
                                <cc1:TextColumn Name="IdArticolo" Header="IdArticolo" Visible="false" />
                                <cc1:TextColumn Name="Articolo" Header="Articolo" />
                                <cc1:NumericColumn Name="Quantita" Header="Quantita" />
                                <cc1:NumericColumn Name="Prenotata" Header="Prenotata" />
                                <cc1:NumericColumn Name="Giacenza" Header="Giacenza" />
                                <cc1:TextColumn Name="Note" Header="Note" />
                                <cc1:BooleanColumn Name="Chiuso" Header="Chiuso" />
                                <cc1:ActionColumn >
                                    <Actions>
                                        <cc1:ActionIcon Icon="fa fa-pencil" Callback="EditCallback" />
                                        <cc1:ActionIcon Icon="fa fa-trash-o" Callback="DeleteCallback" />
                                        <cc1:ActionIcon Icon="fa fa-search" Callback="ShowImage" />
                                    </Actions>
                                </cc1:ActionColumn>
                            </Columns>
                        </ColumnsConfig>
<%--                        <Buttons>
                            <cc1:CrudEditButton Text="Modifica" Callback="EditDialog" />
                            <cc1:CrudDeleteButton Text="Cancella" Callback="CancellaElemento" />
                        </Buttons>--%>
                    </cc1:JQDataTable>               
               </div>
            </div>
		</div>
	</section>

</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="LocaJavascript" runat="server">
     <% HttpContext.Current.Response.Write(this.JQDTCronologia.RenderScriptsManually()); %>
     <% HttpContext.Current.Response.Write(this.JQDTCronologiaDettaglio.RenderScriptsManually()); %>

<script>
    var m_movimento = null;

    $(document).ready(function () {
        //$.fn.dataTable.moment('DD/MM/YYYY HH:mm');

        // BOOTSTRAP: Tweaks
        $('.yadcf-filter-wrapper').addClass('input-group');
        $('.yadcf-filter, .yadcf-filter-date', this).addClass('form-control input-sm');
        $('.yadcf-filter-reset-button', this).addClass('btn btn-default btn-sm').wrap('<span class="input-group-btn"></span>');
    });

    function TranslateEnum(row, data, index) {

        var m_data = JSON.stringify({ value: data.TipoMovimento });

        $.ajax({
            type: "POST",
            url: '/api/Common/GetEnumDescription',
            data: m_data,
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (response) {

                $('td', row).eq(4).text(response);

            },
            failure: function (response) {
                alert(response.d);
            }
        });
    }

    function MostraDettaglio(obj) {
        //var rowMovimento = GetSelectedData(m_tableJQDTCronologia);
        //if (rowMovimento === undefined) {
        //    alert('Seleziona un movimento...');
        //    return;
        //}

        m_movimento = obj;

        m_tableJQDTCronologiaDettaglio.rows().draw();
    }

    function GetIdMovimento() {
        //var row = GetSelectedData(m_tableJQDTCronologia);

        row = m_movimento;
        return row.Id;
    }

    function GetCustomerMovimento() {
        var row = GetSelectedData(m_tableJQDTCronologia);

        return row.IdCliente;
    }

    function EditDialog(id) {
        //var p = null;
        //p = GetSelectedData(m_tableJQDTCronologiaDettaglio).Id;

        var m_idCliente = GetCustomerMovimento();

        var url = 'EditMovimento.aspx?id=' + id + '&idC=' + m_idCliente;
         
        $("#iframeCrud").prop('src', url).appendTo("#crudDialog");
        $("#iframeCrud").show();

        m_dialog = $("#crudDialog").dialog({
            title: 'Modifica Movimento',
            width: 'auto',
            height: 'auto',
            modal: true,
            close: function () {
                RedrawGrid(m_tableJQDTCronologiaDettaglio);

                $("#iframeCrud").contents().remove();
                $('#iframeCrud').hide();
            }
        });
    }

    function CancellaMovimento() {
        var p = null;

        var rowMovimento = GetSelectedData(m_tableJQDTCronologia);

        var m_idMovimento = rowMovimento.Id;
        var m_tipoMovimento = rowMovimento.TipoMovimento;
        var m_numeroDDT = rowMovimento.NumeroDDT;
        var m_dataDDT = rowMovimento.DataDDT;

        var m_descrizioneMovimento = (m_tipoMovimento === 0 ? 'carico' : 'scarico')

        var url = '/api/Movimenti/CancellaMovimento';

        $("#crudDialog").html("Confermi la cancellazione del movimento di " + m_descrizioneMovimento + " [" + m_numeroDDT + " del " +  m_dataDDT + "] ?");

        // Define the Dialog and its properties.
        $("#crudDialog").dialog({
            resizable: false,
            modal: true,
            title: "Cancella elemento",
            height: 250,
            width: 400,
            buttons: {
                "Yes": function () {
                    $(this).dialog("option", { buttons: {} });
                    //$(this).empty();
                    $(this).dialog('close');

                    $.ajax({
                        type: "POST",
                        url: url,
                        data: JSON.stringify({ id: m_idMovimento, tipoMovimento: m_tipoMovimento }),
                        contentType: "application/json; charset=utf-8",
                        dataType: "json",
                        success: function (response) {
                            RedrawGrid(m_tableJQDTCronologiaDettaglio);
                            RedrawGrid(m_tableJQDTCronologia);

                            $("#crudDialog").empty();

                            alert(response.Message);
                        },
                        failure: function (response) {

                            $("#crudDialog").empty();

                            alert(response);
                        }
                    });
                },
                "No": function () {
                    $("#crudDialog").empty();

                    $(this).dialog('close');
                }
            }
        });
    }

    function CancellaElemento(obj) {
        var p = null;

        var rowMovimento = GetSelectedData(m_tableJQDTCronologia);
        //var row = GetSelectedData(m_tableJQDTCronologiaDettaglio);

        var m_idMovimento = rowMovimento.Id;
        var m_tipoMovimento = rowMovimento.TipoMovimento;

        p = obj.Id;
        p1 = obj.Articolo;
        p2 = obj.Quantita;

        var url = '/api/Movimenti/CancellaElemento';

        $("#crudDialog").html("Confermi la cancellazione dello scarico dell'articolo: " + p1 + " con quantità: " + p2 + " ?");

        // Define the Dialog and its properties.
        $("#crudDialog").dialog({
            resizable: false,
            modal: true,
            title: "Cancella elemento",
            height: 250,
            width: 400,
            buttons: {
                "Yes": function () {
                    $(this).dialog("option", { buttons: {} });
                    //$(this).empty();
                    $(this).dialog('close');

                    $.ajax({
                        type: "POST",
                        url: url,
                        data: JSON.stringify({ id: p, tipoMovimento: m_tipoMovimento }),
                        contentType: "application/json; charset=utf-8",
                        dataType: "json",
                        success: function (response) {
                            RedrawGrid(m_tableJQDTCronologiaDettaglio);
                            RedrawGrid(m_tableJQDTCronologia);

                            $("#crudDialog").empty();

                            alert(response.Message);
                        },
                        failure: function (response) {

                            $("#crudDialog").empty();

                            alert(response);
                        }
                    });
                },
                "No": function () {
                    $("#crudDialog").empty();

                    $(this).dialog('close');
                }
            }
        });
    }

    function ShowImage(obj) {
        $("#iframeCrud").prop('src', '/operazioni/ShowImage.aspx?id=' + obj.IdArticolo).appendTo("#crudDialog");
        $("#iframeCrud").width(800);
        $("#iframeCrud").height(450);
        $("#iframeCrud").show();

        m_dialog = $("#crudDialog").dialog({
            title: 'Dettaglio Articolo',
            width: 'auto',
            height: 'auto',
            modal: true,
            close: function () {
                $("#iframeCrud").width(1000);
                $("#iframeCrud").height(550);
                $("#iframeCrud").contents().remove();
                $('#iframeCrud').hide();
            }
        });
    }

    function EditCallback(obj) {
        EditDialog(obj.Id);
    }

    function DeleteCallback(obj) {
        CancellaElemento(obj);
    }
 </script>
</asp:Content>